<template>
    <div class="footer-wrapper">
      <div class="footer-about-wrapper inline">
        <p class="footer-about-title">关于我们</p>
        <span @click="goAbout('company')">公司简介</span><span @click="goAbout('team')">团队介绍</span>
      </div>
      <div class="footer-wx-wrapper inline">
        <div class="wx-qrcode inline"><img src="./qrcode.png" width="100%" alt=""></div>
        <div class="wx-tip inline">微信公众号</div>
      </div>
      <div class="footer-connect-wrapper">
        <p class="footer-connect-title">联系我们</p>
        <p class="footer-address">地址：杭州市滨江区阡陌路459号聚光中心A座7楼</p>
        <p class="footer-tel">咨询预约热线/微信：18268031914</p>
      </div>
      <div class="copyright tc">Copyright©2016-2018 杭州乐事线科技有限公司</div>
    </div>
</template>

<script>
    export default {
        name: "Footer",
        data() {
            return {}
        },
        methods: {
          goAbout(anchor){
            this.$router.push({ name: 'about', params: { anchor: anchor }});
          }
        }
    }
</script>

<style scoped lang="stylus" rel="stylesheet/stylus">
  .footer-wrapper
    padding 54px 70px 30px 70px
    background #f3f3f3
    font-size 0
    .footer-about-wrapper
      .footer-about-title
        font-size 28px
        color #444444
        margin-bottom 20px
      span
        font-size 24px
        color #828282
        margin-right 58px
    .footer-wx-wrapper
      padding-top 5px
      font-size 0
      margin-left 120px
      @media screen and (max-width: 374px)
        margin-left 80px
      .wx-qrcode
        width 120px
        height 120px
      .wx-tip
        width 24px
        font-size 24px
        color #828282
        line-height 24px
        margin-left 30px
    .footer-connect-wrapper
      .footer-connect-title
        font-size 28px
        color #444444
        margin-bottom 20px
      p
        font-size 24px
        color #828282
        margin-bottom 10px
    .copyright
      margin-top 52px
      font-size 20px
      color #828282
</style>
